<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ page isELIgnored="false"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>酒店后台管理系统</title>
<jsp:include page="../commonCss.jsp" />
</head>
<body>
	<div class="layui-fluid">
		<div id="select" style="height:350px;">
			<div class="select_top">
				<div class="select_top_title">
					<span class="layui-breadcrumb" style="visibility:visible;padding: 12px 0 12px 20px;">
	                  <a href="" style="font-size:18px;">客户订单管理</a>
	                  <span lay-separator style="font-size:18px;">/</span>
	                  <a href="" style="font-size:18px;"><cite>订单管理</cite></a>
	              	</span>
	              	<img style="float:right;margin-right:20px;" src="${pageContext.request.contextPath}/resources/img/icon_refresh.png" title="刷新当前页面"
	              		width="25" height="25"/>
				</div>
			</div>
			<div class="select_nav">
				<span>查询条件</span>
				<hr>
				<div style="height:220px;padding-top:10px;">
					<form action="" method="post" name="form1">
						<label>订单编号</label>
						<input type="text" id="orderBH" name="orderBH" placeholder="请输入订单编号"></input>
						<label>所属酒店</label>
						<select id="nameJD" name="nameJD">
						    <option value="选择所属酒店">选择所属酒店</option>
							<option value="如家连锁店">如家连锁店</option>
							<option value="锦江之星">锦江之星</option>
							<option value="速8酒店">速8酒店</option>
							<option value="格林豪泰">格林豪泰</option>
							<option value="南苑E家">南苑E家</option>
							<option value="飘HOME连锁">飘HOME连锁</option>
							<option value="莫泰168">莫泰168</option>
						</select><br/>
						<label>入住姓名</label>
						<input type="text" id="name" name="name" placeholder="请输入住姓名"></input>
						<label>入住电话</label>
						<input type="text" id="phone" name="phone" placeholder="请输入手机号码"></input><br/>
						<label>房间类别</label>
						<select id="category" name="category">
						    <option value="-1">选择类别</option>
							<option value="0">标准间</option>
							<option value="1">双人间</option>
							<option value="2">三人间</option>
						</select><br/>
						<button id="btn" class="btn" data-type="reload">查询</button>
						<button type="reset" class="btn">重置</button>
					</form>
				</div>
			</div>
		</div>
		<div id="showlist">
			<span>全部订单</span>
			<hr>
			<div>
				<table class="layui-table" id="test" lay-filter="demo"></table>
			</div>
		</div>
	</div>
</body>
<!-- 引入 layui.js -->
<script src="https://layui.11dz.cn/layui-v2.6.8/layui/layui.js"></script>
<script src="${pageContext.request.contextPath}/resources/js/jquery-3.6.0.min.js"></script>
<script src="${pageContext.request.contextPath}/resources/js/jquery-cookie.js"></script>
<script type="text/javascript">
	layui.use('layer', function(){
		  var layer = layui.layer;
		  if(<%=request.getSession().getAttribute("username")%> !=null){
			  layer.msg("欢迎来到酒店后台管理系统");
	 }else{
		  alert("请登录");
		  window.open("${pageContext.request.contextPath}/views/admin/user/login.jsp");
	 }
	});
	layui.use('table', function(){
	  var table = layui.table;
	  table.render({
		id:'ordertable'
	    ,elem: '#test'
	    ,url:'${pageContext.request.contextPath}/order/findAll'
	    ,height: 'full-400'
	    ,cellMinWidth: 100 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
	    ,cols: [[
	       {field:'orderBH', width:120, title: '订单编号', align:"center",fixed: true,sort: true,width: '10%', minWidth: 50}
	      ,{field:'nameJD', width:80, title: '所属酒店', align:"center", width: '15%', minWidth: 50}
	      ,{field:'category', width:110,title: '房间类别', align:"center",
	    	templet: function(res) {
				if(res.category == '0') {
					return '标准间';
				} else if(res.category == '1') {
					return '双人间';
				} else {
					return '三人间';
				} 
			}
	      }
	      ,{field:'price', title: '支付价格', align:"center",
	    	  templet: function(res) {
	    		  return '￥' + res.price;
			}
	      }
	      ,{field:'name', title: '入住姓名', align:"center"}
	      ,{field:'phone', title: '入住电话', align:"center"}
	      ,{field:'floor', title: '房间楼层', align:"center"}
	      ,{field:'roomNumber', title: '房间号', align:"center"}
	      ,{field:'orderAddTime', title: '入住时间', align:"center", sort: true,width: '12%', minWidth: 50}
	      ,{field:'updateTime', title: '修改时间', align:"center", sort: true,width: '12%', minWidth: 50}
	      ,{title: '操作', align:"center",toolbar: '#barDemo'}
	    ]]
	    ,page: true
	    ,limit:20
	    ,response: {
	      statusCode: 200, //重新规定成功的状态码为 200，table 组件默认为 0
	    }
	    ,parseData: function(res){ //将原始数据解析成 table 组件所规定的数据
	      return {
	    	  "code":200,
	    	  "count":res.orderlist.length,
	    	  "data": res.orderlist //解析数据列表
	      };
	    }
	  });
	  $('#btn').on('click', function() {
		 var orderBH = $('#orderBH').val();
		 var nameJD = $('#nameJD').val();
		 var name = $('#name').val();
		 var phone = $('#phone').val();
		 var category = $('#category').val();
	      //执行重载
	      table.reload('ordertable', {
	        url:'${pageContext.request.contextPath}/order/search',
	        where: {
	        	orderBH:orderBH,
	        	nameJD:nameJD,
	        	name:name,
	        	room_type:phone,
	        	category:category
	        }
	      });
	      return false;
 	  });
	  //监听工具条
	  table.on('tool(demo)', function(obj){
	    var data = obj.data;
	    if(obj.event === 'del'){
	      layer.confirm('是否删除该订单信息', function(index){
	    	  $.ajax({
                url : "${pageContext.request.contextPath}/order/delete",
                data : {
                    'orderBH' : data.orderBH,
                },
                type : "post",
                dataType : "json",
                success : function(data) {
              	  obj.del();
              	  layer.msg("删除成功");
                    layer.close(index);
                },
                error : function(data) {
                    layer.msg("删除失败");
                    layer.close(index);
                }
            });
	        
	      });
	    } else if(obj.event === 'edit'){
	    	layer.open({
  			  title:['正在编辑' + data.orderBH + '订单编号','color:#ff0066;text-align:center;'],
	    		  type: 2,
	    		  area: ['700px', '710px'],
	    		  skin: 'layui-layer-demo', //样式类名
	    		  closeBtn: 1, //不显示关闭按钮
	    		  anim: 2,
	    		  shadeClose: false, //开启遮罩关闭
	    		  content: '${pageContext.request.contextPath}/views/admin/order/orderupdate.jsp?orderBH=' + data.orderBH + "&nameJD=" + data.nameJD
	    				  + "&name=" + data.name + "&floor=" + data.floor + "&roomNumber=" + data.roomNumber,
	    		  end:function() {
	  				  var isorderupdate = JSON.parse(localStorage.getItem("isorderupdate"));//这里是取值
		    			  if(isorderupdate != null && isorderupdate !=""){
		    				  layer.msg("修改成功");
			    			  obj.update({
			    				  category: isorderupdate.orderlist[0].category,
			    				  price: isorderupdate.orderlist[0].price,
			    				  phone: isorderupdate.orderlist[0].phone,
			    				  updateTime: isorderupdate.orderlist[0].updateTime
			                  });
		    			  }
					  }
  		});
	    }
	  });
	});
	$(document).ready(function(){
		$('img').on('click', function() {
			location.reload();
		});
	});
</script>
<script type="text/html" id="barDemo">
  <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
  <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
</html>